<template>
  <div>
    <cus-modal
      ref="modal"
      :title="!form.id ? '添加供应信息' : '修改供应信息'"
      @on-visible-change="onVisibleChange"
      width="780"
      @onOk="onOk"
    >
      <Form
        ref="formValidate"
        :model="form"
        :rules="ruleValidate"
        :label-width="125"
      >
        <FormItem
          label="食材名称:"
          prop="foodName"
          :rules="{
            required: true,
            message: '食材名称不能为空',
            trigger: 'blur'
          }"
        >
          <Input
            v-model="form.foodName"
            clearable
            style="width: 200px"
            placeholder="请输入食材名称"
          ></Input>
        </FormItem>
        <FormItem
          label="食材种类:"
          prop="foodTypeName"
          :rules="{
            required: true,
            message: '食材种类不能为空',
            trigger: 'change'
          }"
        >
          <Select
            v-model="form.foodTypeName"
            style="width:200px"
            placeholder="请选择食材种类"
            clearable
          >
            <Option
              :value="item.name"
              v-for="(item, index) in localfoodtypeList"
              :key="index"
              >{{ item.name }}</Option
            >
          </Select>
        </FormItem>
        <FormItem
          label="供应商名称:"
          prop="supplyName"
          :rules="{
            required: true,
            message: '供应商不能为空',
            trigger: 'change'
          }"
        >
          <Select
            v-model="form.supplyName"
            style="width:200px"
            placeholder="请选择供应商"
            clearable
          >
            <Option
              :value="item.name"
              v-for="(item, index) in querySupplierList"
              :key="index"
              >{{ item.name }}</Option
            >
          </Select>
        </FormItem>
        <FormItem
          label="商品种类:"
          prop="productCategory"
          :rules="{
            required: true,
            message: '商品种类不能为空',
            trigger: 'change'
          }"
        >
          <Select
            v-model="form.productCategory"
            style="width:200px"
            placeholder="请选择商品种类"
            clearable
          >
            <Option
              :value="item.categoryName"
              v-for="(item, index) in productcategoryList"
              :key="index"
              >{{ item.categoryName }}</Option
            >
          </Select>
        </FormItem>

        <FormItem
          label="规格:"
          prop="specification"
          :rules="[
            {
              required: true,
              message: '规格不能为空',
              trigger: 'change',
              type: 'number'
            }
          ]"
        >
          <Select
            v-model="form.specification"
            style="width: 200px"
            placeholder="请选择规格"
            @on-change="changeSpecification"
          >
            <Option
              :value="item.specificationValue"
              v-for="(item, index) in specificationList"
              :key="index"
              >{{ item.specification }}</Option
            >
          </Select>
        </FormItem>
        <FormItem
          label="单位重量/kg:"
          prop="unitWeight"
          :rules="[
            {
              required: true,
              message: '单位重量不能为空',
              trigger: 'blur',
              type: 'number'
            }
          ]"
        >
          <InputNumber
            :min="0"
            v-model="form.unitWeight"
            style="width: 200px"
            :disabled="form.specification == 0 || form.specification == 1"
          ></InputNumber>
        </FormItem>
        <FormItem
          label="价格:"
          prop="price"
          :rules="{
            required: true,
            message: '价格不能为空',
            trigger: 'blur',
            type: 'number'
          }"
        >
          <InputNumber
            :min="0"
            v-model="form.price"
            style="width:200px"
          ></InputNumber>
        </FormItem>
        <FormItem
          label="是否称重方式出入库:"
          prop="weightFlag"
          :rules="[
            { required: true, message: '称重方式不能为空', trigger: 'change' }
          ]"
        >
          <Select
            v-model="form.weightFlag"
            placeholder="请选择称重方式"
            style="width: 200px"
          >
            <Option value="0">否</Option>
            <Option value="1">是</Option>
          </Select>
        </FormItem>
        <FormItem label="品牌:" prop="brand">
          <Input
            v-model="form.brand"
            clearable
            maxlength="20"
            style="width: 200px"
            placeholder="请输入品牌"
          ></Input>
        </FormItem>
        <FormItem label="条码:" prop="snCode">
          <Input
            v-model="form.snCode"
            clearable
            maxlength="20"
            style="width: 200px"
            placeholder="请输入条码"
          ></Input>
        </FormItem>
        <FormItem prop="effectiveDate" label="生效日期:">
          <DatePicker
            type="date"
            placeholder="请选择生效日期"
            v-model="form.effectiveDate"
            style="width: 200px"
          ></DatePicker>
        </FormItem>
      </Form>
    </cus-modal>
  </div>
</template>

<script>
import {
  foodRaiseAdd,
  getDishType,
  productcategory,
  getProductCategory,
  selectBasSpecificationList,
  localfoodtype
} from "@/api/business/dishesModule";

const form = {
  supplyName: "", // 供应商名称
  foodName: "", // 食材名称
  price: 0, // 价格
  foodTypeName: "", // 食材分类
  unitWeight: 1, // 单位重量
  specification: "", // 规格
  productCategory: "", // 商品分类
  brand: "",
  snCode: "",
  weightFlag: "1",
  effectiveDate: ""
};

export default {
  name: "addSupplyinfoModal",
  data() {
    return {
      form: form,
      ruleValidate: {},
      specificationList: [],
      localfoodtypeList: [],
      productcategoryList: [], // 商品分类列表
      querySupplierList: [] // 供应商列表
    };
  },
  mounted() {
    this.form = this.$cu.deepClone(form);
  },
  methods: {
    onVisibleChange(v) {
      if (!v) {
        this.$refs["formValidate"].resetFields();
        this.form = this.$cu.deepClone(form);
      }
    },
    show() {
      this.$refs["modal"].show = true;
      this.selectBasSpecificationListApi();
      this.localfoodtypeApi();
      this.productcategoryApi();
      this.querySupplierNamelistApi();
    },
    onOk() {
      this.$refs["formValidate"].validate(valid => {
        if (valid) {
          this.foodRaiseAddApi();
        }
      });
    },
    // 添加
    foodRaiseAddApi() {
      return new Promise(resolve => {
        this.loading = true;
        let obj = this.form;
        obj.effectiveDate = obj.effectiveDate
          ? new Date(obj.effectiveDate).Format("yyyy-MM-dd hh:mm:ss")
          : null;
        foodRaiseAdd(obj).then(res => {
          if (res.retCode === 2000) {
            this.$Message.success("添加成功");
            this.$refs["modal"].show = false;
            this.$parent.onInit();
            resolve();
          } else this.loading = false;
        });
      });
    },
    // 获取食材规格
    selectBasSpecificationListApi() {
      return new Promise(resolve => {
        selectBasSpecificationList({}).then(res => {
          if (res.retCode === 2000) {
            this.specificationList = res.data;
            if (res.data.length && !this.form.materialId) {
              this.form.specification = res.data[0].specificationValue;
            }

            resolve();
          }
        });
      });
    },
    // 规格变更
    changeSpecification(value) {
      console.log("value---" + value);
      if (value == 0) {
        this.form.unitWeight = 1;
      }
      if (value == 1) {
        this.form.unitWeight = 0.5;
      }
    },
    // 获取食材种类
    localfoodtypeApi() {
      return new Promise(resolve => {
        localfoodtype({}).then(res => {
          if (res.retCode === 2000) {
            this.localfoodtypeList = res.data;
            resolve();
          }
        });
      });
    },
    // 获取商品分类
    productcategoryApi() {
      return new Promise(resolve => {
        getProductCategory().then(res => {
          if (res.code === 1) {
            this.productcategoryList = res.result.filter(
              item => item.status == "ENABLE"
            );
            resolve();
          }
        });
      });
    },
    // 获取供应商列表
    querySupplierNamelistApi() {
      return new Promise(resolve => {
        getDishType({}).then(res => {
          if (res.retCode === 2000) {
            console.log("111");
            this.querySupplierList = res.data;
            resolve();
          }
        });
      });
    }
  }
};
</script>

<style scoped lang="less">
.permission {
  height: 300px;
  width: 500px;
  border: 1px solid #dcdee2;
  overflow-y: auto;
  border-radius: 2px;
  padding: 0 0 0 10px;
}
</style>
